<%@ page language="java" contentType="text/html; charse=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta charset="utf-8">
<jsp:include page="../public/header.jsp"/>
<link href="/public/css/register.css" rel="stylesheet" type="text/css" />
</head>
<body>
<jsp:include page="../public/nav.jsp"/>
	<div class="context">
    	<div class="box-left">
        <!--banner-->
        	<div class="x">
                <div id="slider-4">
                <div class="slider">
                    <div class="bd">
                        <ul>
                            <li><a href="#" target="_blank"><img src="/public/image/banner-2.jpg" ></a></li>
                            <li><a href="#" target="_blank"><img src="/public/image/banner-2.jpg" ></a></li>
                            <li><a href="#" target="_blank"><img src="/public/image/banner-2.jpg" ></a></li>
                            <li><a href="#" target="_blank"><img src="/public/image/banner-2.jpg" ></a></li>
                        </ul>
                    </div>
                </div>
            </div>
            </div>
            <!--banner-->
            <div style="height: 110px;line-height: 110px;text-align: center;font-size: 16px;">这里空白一片什么都没有啊!</div>
        </div>
        <div class="box-right">
        	<div class="title">欢迎加入我们玩点！！！</div>
        	<div class="nav">
        	    <div class="steps">
                  <span id="step1" class="active step">第一步</span>
                  <span id="step2" class="disabled step">第二步</span>
                  <span id="step3" class="disabled step">第三步</span>
                  <span id="step4" class="disabled step">完成</span>
                </div>
            </div>
            <!--firest-->
            <div id="firest" style="display:block;">
                <div class="tent f-l">
                    <ul class="">
                        <li>
                        <label>用户名:</label>
                        <input id="name" class="input-text" type="text" placeholder="请输入你的用户名" autofocus></li>
                        <span id="namemsg" style="color:red"></span>
                        <li>
                        <label>Email:</label>
                        <input id="email" class="input-text" type="email" placeholder="请输入E-mail邮箱地址"></li>
                         <span id="emailmsg" style="color:red"></span>
                        <li>
                        <label>真实姓名(选填):</label>
                        <input id="realname" class="input-text" type="text" placeholder="请输入真实姓名"></li>
                        <li>
                        <label>how young are you?</label>
                        <input id="age" class="input-text" type="text" placeholder="你多大了" pattern="[0-9]+"></li>
                        <li><input id="next1" class="btn btn-warning f-r" type="button" value="下一步>"><div class="clearfix"></div></li>
                        <li><a href="#" style="color:#dd514c;">有什么意见可以反馈给我哦！！！！Q A Q!!</a></li>
                    </ul>
                </div>
                <div class="ads f-r">
                    <img src="/public/image/ads.jpg">
                </div>
            </div>
            <!--two-->
            <div id="two" style="display:none">
            	<div class="tent f-l">
                	<ul>
                    	<li>
                        	<label>邮箱：</label>
                            <input id="email2" class="input-text" readonly type="email">
                        </li>
                        
                    	<li>
                        	<label>验证码(验证码已经发送到你的邮箱请注意查收)：</label>
                            <input id="vif" class="input-text" type="text"><span id="resend">重新发送</span>
                        	<span id="vifmsg" style="color:red"></span>
                        </li>
                        
                    	<li>
                        	<label>密码设置：</label>
                            <input id="pwd" class="input-text"  type="password">
                        	<span id="pwdmsg" style="color:red"></span>
                        </li>
                        
                    	<li>
                        	<label>重复密码：</label>
                            <input id="repwd" class="input-text"  type="password">
                        	<span id="repwdmsg" style="color:red"></span>
                        </li>
                        <li><input id="next2" class="btn btn-warning f-r" type="button" value="下一步>"><div class="clearfix"></div></li>
                        <li><a href="#" style="color:#dd514c;">有什么意见可以反馈给我哦！！！！Q A Q!!</a></li>
                    </ul>
                </div>
                <div class="ads f-r">
                    <img src="/public/image/ads.jpg">
                </div>
            </div>
            <!--three-->
            <div id="three" style="display:none;">
            	<div class="tent f-l">
					<ul>
                    	<li>欢迎加入我们！<a href="/index.html">回到首页</a></li>
                        <li>寻找朋友！</li>
                        <li>名人推荐！</li>
                    	<li><a href="#" style="color:#dd514c;">有什么意见可以反馈给我哦！！！！Q A Q!!</a></li>
                    </ul>
                </div>
            </div>
            <!--over-->
        </div>
    </div>
	<div class="clearfix"></div>
<jsp:include page="../public/footer.jsp"/>
</body>

<jsp:include page="../public/footer2.jsp"/>
<script type="text/javascript">
	$(function(){
		alert("暂不开发注册！");
		window.location.href="/index.html";
		 var backToTopFun = function() {
		    	var st = $(document).scrollTop(), winh = $(window).height();
		    	(st > 0)? $backToTopEle.show(): $backToTopEle.hide();
		    	/*IE6下的定位*/
		    	if(!window.XMLHttpRequest){
		    		$backToTopEle.css("top", st + winh - 166);
		    	}
		    };
		    	$(window).on("scroll",backToTopFun);
		    	backToTopFun();
		    	jQuery("#slider-4 .slider").slide({mainCell:".bd ul",titCell:".hd li",trigger:"click",effect:"leftLoop",autoPlay:true,delayTime:700,interTime:7000,pnLoop:false,titOnClassName:"active"})});
		var $backToTopEle=$('<a href="javascript:void(0)" class="Hui-iconfont toTop" title="返回顶部" alt="返回顶部" style="display:none">&#xe684;</a>').appendTo($("body")).click(function(){
		    	$("html, body").animate({ scrollTop: 0 }, 120);
	});
</script>
<script type="text/javascript">
	var nameb = false,emailb = false,ageb = false;
	var vifb = false,pwdb = false,repwdb = false;
	
	$(function(){
		$("#next2").click(function(){
			//if(vifb & pwdb & repwdb){
				$.ajax({url:"register_chk2.html",data:{"pwd":$("#pwd").val()},success:function(data){
					if(data == 1){
						alert("恭喜你完成注册！");
						window.location.href="/index.html";
						$("#step2").attr("class","step");
						$("#step3").attr("class","active step");
						$("#two")[0].style.display = "none";
						$("#three")[0].style.display = "block";
					}
				}})	
			//}
		})
		$("#repwd").blur(function(){
			if($("#repwd").val() == $("#pwd").val()){
				repwd = true;
				$("#repwdmsg").text("");
			}else{
				repwd = false;
				$("#repwdmsg").text("俩次输入的密码不一致！");
			}
		})
		$("#pwd").blur(function(){
			if($("#pwd").val().length < 6){
				$("#pwdmsg").text("密码最少为6位");
				pwdb = false;
			}else{
				$("#pwdmsg").text("");
				pwdb = true;
			}
		})
		$("#vif").blur(function(){
			var code = $("#vif").val();
			if(code.length < 6){
				$("#vifmsg").text("验证码不正确");	
			}else{
				$.ajax({url:"register/vifcode_check.html",data:{"code":code},success:function(data){
					if(data == 1){
						//$("#vifmsg").text("验证码正确");
						vifb = true;
						$("#vifmsg").text("");
					}else{
						vifb = false;
						$("#vifmsg").text("验证码错误，或已经失效");
					}
				}})
			}
			
		});
		
		//firest1
		$("#next1").click(function(){
			var age = $("#age").val();
			if(age.length >= 1){
				ageb = true;
			}
			if(nameb & emailb & ageb){
				$.ajax({url:"register_chk.html",data:{name:$("#name").val(),
					email:$("#email").val(),realname:$("#realname").val(),
					age:$("#relname").val()},success:function(data){
						if(data == 1){
							//$.Huimodalalert('验证码以及发送到你的邮箱请注意查收！',2000);
							$("#firest")[0].style.display = "none";
							$("#two")[0].style.display = "block";
							//console.log($(".step:eq[0]"));
							//alert($(".step:eq[0]").text());
							//$(".step:eq[0]").attr("class","step");
							//$(".step:eq[1]").attr("class","active step");
							$("#step1").attr("class","step");
							$("#step2").attr("class","active step");
							//consloe.log($("email").val());
							$("#email2").val($("#email").val());
						}else{
							//$.Huimodalalert(data,2000);
						}
					}});
			}
		});
		$("#email").blur(function(){
			var email = $("#email").val();
			var reg = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
			emailb = reg.test(email);
			if(emailb){
				$.ajax({url:"register/checkemail.html",data:{"email":email},success:function(e){
					if(e == 1){
						$("#emailmsg").text("");
					}else{
						$("#emailmsg").text("邮箱已经被注册!!!");
					}
				}});
			}else{
				$("#emailmsg").text("你输入的email地址不正确！");
			}
		});
		$("#name").blur(function(){
		//	alert("12");
			var name = $("#name").val();
			if(name.length == 0){
				$("#namemsg").text("请输入用户名！");
				return;
			}
			var regx =  /^[A-Za-z0-9\u4E00-\u9FFF]*$/;
			nameb = regx.test(name);
			if(nameb){
				$.ajax({url:"register/checkname.html",data:{"name":name},success:function(data){
					if(data == 1){//用户名没有被注册
						//alert("用户名没有被注册！！");
						$("#namemsg").text("");
					}else{
						//alert("用户名已经被注册！！");
						nameb = false;
						$("#namemsg").text("用户名已经被注册");
					}
				}});
			}else{
				nameb = false;
				$("#namemsg").text("请输入正确的用户名，用户名只能以数字字符或者汉子");
			}
		})
	})
</script>
</html>
